<template>
	<div class="breedingdetails">
		<div class="waitwritelist">
			<div class="inputbox flcm">
				<div class="label fsize28l">公猪耳号：</div>
				<input type="text" placeholder="输入内容" class="standard"/>
			</div>
			<div class="inputbox flcm">
				<div class="label fsize28l">精液量：</div>
				<input type="text" placeholder="输入内容" class="standard"/>
			</div>
			<div class="inputbox flcm pickbox">
				<div class="label fsize28l">品种：</div>
				<picker @change="bindPickerChange" :range="array">
						<input type="text" placeholder="输选择" v-model="now"  class="standard smallinput"/>
						<image src="../../../static/administrator/down.png" class="img32 pickdownbtn" mode=""></image>	
				</picker>
			</div>
			<div class="inputbox flcm">
				<div class="label fsize28l">精子密度：</div>
				<input type="text" placeholder="输入内容" class="standard smallinput"/>
				<div class="label fsize28">亿/ml</div>
			</div>
			<div class="inputbox flcm">
				<div class="label fsize28l">精子活力：</div>
				<input type="text" placeholder="输入内容" class="standard smallinput"/>
				<div class="label fsize28">%</div>
			</div>
			<div class="inputbox flcm">
				<div class="label fsize28l">稀释份数：</div>
				<input type="text" placeholder="输入内容" class="standard smallinput"/>
				<div class="label fsize28">份</div>
			</div>
			<div class="inputbox flcm pickbox">
				<div class="label fsize28l">每份含量：</div>
				<picker @change="bindPickerChange" :range="array">
						<input type="text" placeholder="输选择" v-model="now"  class="standard smallinput"/>
						<image src="../../../static/administrator/down.png" class="img32 pickdownbtn" mode=""></image>	
				</picker>
			</div>
		</div>
		<div class="bcbox"></div>
		<div class='flcm pad32x'>
			<span class= 'lable'></span><span class='fsize28l'>创建时间：</span><span class='fsize28'>2020-03-31</span>
		</div>
		<div class="flcm dancheckbox">
			<image :src="checknum ==0?check:nocheck" class="img32" mode="" @click="checknum=0"></image>
			<span class='fsize28 ok'>采集成功</span>
			<image :src="checknum ==1?check:nocheck" class="img32" mode=""@click="checknum=1"></image>
			<span class='fsize28'>采集失败</span>
		</div>
		<textarea name="" id="" cols="30" rows="10" class="text" placeholder="采集失败内容描述"></textarea>
		<div class="savebtn">保存</div>
		<div class="savebtn jingfen">精液袋分装列表</div>
	</div>


</template>

<script>
	import nocheck from '../../../static/administrator/nocheckbtn.png'
	import check from '../../../static/administrator/checkbtn.png'
	export default {
		data() {
			return {
				now: '',
				checknum:0,
				nocheck:nocheck,
				check:check,
				array:['有库存','没库存']
			};
		},
		onLoad: function() {

		},
		methods: {
			gotogoods(e) {
				uni.navigateTo({
					url: '../goods/goods' 
				});
			},
			bindPickerChange(e) {
				this.now = this.array[e.target.value]
			}
		}
	}
</script>

<style lang="less">
	.pickdownbtn {
		position: absolute!important;
		left: 444rpx;
		top: 24rpx;
	}
	.pad32s {
		padding: 32rpx 0 0 32rpx;
	}
	.pad32x {
		padding:  0  0 32rpx 32rpx;
		margin-top: 16rpx;
	}
	.mgl32 {
		margin-left: 32rpx;
	}
	.standard {
		width:546rpx;
		height:80rpx;
		box-sizing: border-box;
		border-radius:12rpx;
		border:2rpx solid rgba(190,190,190,0.3);
		padding-left: 24rpx;
		font-size:28rpx;
		font-family:PingFangSC-Regular,PingFang SC;
		font-weight:400;
		color:rgba(153,153,153,1);
		-webkit-box-shadow: inset 0 2rpx 2rpx rgba(0, 0, 0, .075);
		box-shadow: inset 0 2rpx 2rpx rgba(0, 0, 0, .075);
		-webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
		-o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
		transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
	}
	.text {
		margin-top: 16rpx;
		margin-left: 32rpx;
		box-sizing: border-box;
		width:686rpx;
		height:208rpx;
		background:rgba(255,255,255,1);
		border-radius:12rpx;
		border:2rpx solid rgba(190,190,190,0.3);
		padding:16rpx 32rpx;
		font-size:28rpx;
		font-family:PingFangSC-Regular,PingFang SC;
		font-weight:400;
		color:rgba(153,153,153,1);
		-webkit-box-shadow: inset 0 2rpx 2rpx rgba(0, 0, 0, .075);
		box-shadow: inset 0 2rpx 2rpx rgba(0, 0, 0, .075);
		-webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
		-o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
		transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
	}
	.smallinput {
		width:346rpx;
		margin-right: 14rpx;
	}
	.lable {
		width:6rpx;
		height:18rpx;
		background:rgba(24,108,242,1);
		border-radius:5rpx;
		margin-right: 14rpx;
	}
	.waitwritelist {
		padding:32rpx 32rpx 0;
		.inputbox {
			margin-bottom: 32rpx;
			.label {
				width: 140rpx;
			}
		}
	}
	.dancheckbox {
		padding:0 32rpx 32rpx;
		image {
			margin-left: 6rpx;
		}
		.ok {
			margin-right: 64rpx;
		}
	}
	.breedingdetails {
		.savebtn {
			position: relative;
			margin-top: 96rpx;
			margin-left: 32rpx;
		}
		.jingfen {
			margin-top: 32rpx;
			background-color: #FFFFFF;
			border: #007AFF;
			border: 2rpx solid rgba(24,108,242,1);
			color: rgba(24,108,242,1);
		}
	}
</style>
